jQuery ফর্ম ইভেন্টগুলি ওয়েব ফর্মের ইন্টারেকশনের পরিচালনায় খুব কার্যকর। এগুলি ব্যবহার করে ডেভেলপাররা ব্যবহারকারীর ইনপুটের প্রতিক্রিয়া দিতে পারেন এবং ফর্ম ডেটা নিয়ন্ত্রণ করতে পারেন। এই সেকশনে, আমরা focus(), blur(), change(), এবং submit() ফাংশনগুলি আলোচনা করব।
focus()
focus() ইভেন্ট কোনো ফর্ম এলিমেন্টে ফোকাস হলে ট্রিগার হয়। এটি ব্যবহার করে আপনি কোনো এলিমেন্টে ফোকাস আসলে কী ঘটবে তা নির্ধারণ করতে পারেন।
উদাহরণ:
$("input").focus(function() {
$(this).css("background-color", "#cccccc");
});
এখানে, যখন কোনো input ফিল্ডে ফোকাস আসবে, তখন তার ব্যাকগ্রাউন্ড রঙ পরিবর্তন হবে।
blur()
blur() ইভেন্ট কোনো ফর্ম এলিমেন্ট থেকে ফোকাস সরে গেলে ট্রিগার হয়। এটি ব্যবহার করে আপনি কোনো এলিমেন্ট থেকে ফোকাস সরে যাওয়ার পরে কী হবে তা নির্ধারণ করতে পারেন।
উদাহরণ:
$("input").blur(function() {
$(this).css("background-color", "#ffffff");
});
এখানে, যখন কোনো input ফিল্ড থেকে ফোকাস সরে যাবে, তখন তার ব্যাকগ্রাউন্ড রঙ আবার সাদা হবে।
change()
change() ইভেন্ট কোনো ফর্ম এলিমেন্টের ভ্যালু পরিবর্তন হলে ট্রিগার হয়। এটি বিশেষত সিলেক্ট বক্স, চেকবক্স বা রেডিও বাটনের জন্য কার্যকর।
উদাহরণ:
$("#mySelect").change(function() {
var selected = $(this).val();
alert("You selected: " + selected);
});
এখানে, যখন ব্যবহারকারী #mySelect সিলেক্ট বক্স থেকে একটি অপশন নির্বাচন করবেন, তখন একটি এলার্ট দ্বারা নির্বাচিত অপশনটি দেখানো হবে।
submit()
submit() ইভেন্ট ফর্ম সাবমিট হলে ট্রিগার হয়। এটি ফর্ম ডেটা পাঠানোর আগে ভ্যালিডেশন বা অন্যান্য কাজ করার জন্য ব্যবহার করা হয়।
উদাহরণ:
$("#myForm").submit(function(e) {
e.preventDefault(); // ফর্ম সাবমিট প্রতিরোধ করে
// এখানে ভ্যালিডেশন বা অন্যান্য কাজ করা যাবে
});
এখানে, ফর্ম সাবমিট হলে, এটি আসলে সাবমিট হবে না; পরিবর্তে, আপনি যা চান তা পরিচালনা করতে পারেন, যেমন ইনপুট ভ্যালিডেট করা।
jQuery-র ফর্ম ইভেন্টগুলি ব্যবহার করে, ওয়েব ডেভেলপাররা ফর্ম ইন্টারেকশনগুলি সহজে এবং কার্যকরভাবে পরিচালনা করতে পারেন। এগুলি ব্যবহার করে উন্নত ইউজার এক্সপেরিয়েন্স তৈরি এবং ভ্যালিডেশন প্রক্রিয়া সহজতর করা সম্ভব হয়।
Read more